<template>
	<view>
		<view class="content">
			<view style="margin: 100upx auto;text-align: center;">
				<image src="https://wx.qlogo.cn/mmhead/Q3auHgzwzM7JuiaWmmYESVTfut2jzmeQWNbWYM584O3ldNybgCep7sA/0" mode=""></image>
			</view>
			<view style="padding-left: 50upx;font-size: 32upx;">
				为了您更好的体验,申请获取以下权限
			</view>
			<view style="padding-left: 50upx;color: #ccc;margin-top: 40upx;">
				获得您的公开信息(昵称,头像等)
			</view>
			<!-- 先获取手机号再登录 -->
			<!-- <button type="warn" v-if="!can_login" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" style="background-color: #7C2548;width: 50%;border-radius: 50upx;margin-left: 25%;">获取号码</button> -->
			<button type="warn" open-type="getUserInfo" @getuserinfo="wxGetUserInfo" style="background-color: #E82F27;width: 50%;border-radius: 50upx;margin-left: 25%;">授权登录</button>
			
			<view style="text-align: center;color: #999;margin-top: 30upx;" @click="navTo('/pages/index/index')" >
				~~随便逛逛~~
			</view>
		</view>
		
		<u-popup border-radius="10" v-model="show"
			@close="close" @open="open" mode="center" 
			length="70%" :mask="mask"
		>
			<view style="width: 90%;margin: 0 auto;height: 350rpx">
				<view style="margin-top: 50upx;font-size: 32upx;">
					绑定手机号
				</view>
				<view style="margin-top: 40upx;font-size: 32upx;">
					请先绑定手机号在进行此操作
				</view>
				<view class="close-btn">
					<button open-type="getPhoneNumber" @getphonenumber="getPhoneNumber" style="background-color: #E82F27;color: #fff;">微信用户一键绑定</button>
				</view>
			</view>
		</u-popup>
		
		
		<!-- <view style="text-align: center;position: fixed;width: 100%;bottom: 50px;" @click="reLaunch" data-src="codeLogin/codeLogin">短信验证码登录</view> -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
				show:false,
				mask: true, // 是否显示遮罩
				loading: false,
				can_login: false, //先获取手机号才能登录
				nickname: '',
				avatar: '',
				province: '',
				city: '',
				pid:0, // 邀请码 上级id
				pids:0, // 邀请码 上上级id
				goodsid: '', // 商品的id,登录后跳转到指定商品
				session_key: '', // 获取手机号需要的参数
			};
		},
		onLoad:function(e){
			// 邀请码
			if ( e.goodsid ) {
				this.goodsid = e.goodsid
			}
			uni.getSystemInfo({
				success: (res) => {
					this.systemInfo = res
					this.width = res.windowWidth
					this.height = res.windowHeight
				}
			})
			uni.getStorage({
				key: 'pid',
				success: (res) => {
					this.pid = res.data
				},
			});
			uni.getStorage({
				key: 'pids',
				success: (res) => {
					this.pids = res.data
				},
			});
		},
		onBackPress(options) {
				this.back();  
				return true;  
		},
		methods: {
			getPhoneNumber (res) {
				var o = this
				this.show = false // 关掉弹窗
				this.can_login = true
				console.log(res.detail.encryptedData)
				uni.request({
					url: 'https://www.xiaonengxinxi.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=account.getMobile&app=1',
					method: 'POST',
					data: {
						sessionKey: this.session_key,
						encryptedData: res.detail.encryptedData,
						iv: res.detail.iv,
						cloudID: res.detail.cloudID,
					},
					header:{
						'Content-Type':'application/x-www-form-urlencoded'
					},
					success: (ress) => { // 后台存储数据
						console.log(ress)
						uni.setStorage({
							key: 'phone',
							data: ress.data.phoneNumber,
						})
						uni.request({
							url: 'https://www.xiaonengxinxi.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=account.small_app_login&app=1',
							method: 'POST',
							data: {
								openid: o.openid,
								mobile: ress.data.phoneNumber, // 传给后台手机号
								nickname: o.nickname,
								avatar: o.avatar,
								province: o.province,
								city: o.city,
								pid: o.pid,
								pids: o.pids
							},
							header:{'Content-Type':'application/x-www-form-urlencoded'},
							success: res => {
								uni.setStorage({
									key: 'openid',
									data: res.data.openid,
									success: function () {
										setTimeout(function() {
											uni.navigateBack()
										}, 1700);
									}
								})
							},
							fail: () => {},
							complete: () => {}
						});
					}
				})
			},
			wxGetUserInfo (res) {
				var o = this
				let info = res.detail.userInfo
				this.nickname = info.nickName
				this.avatar = info.avatarUrl
				this.province = info.province
				this.city = info.city
				uni.setStorage({
					key: 'nickname',
					data: this.nickname,
				})
				uni.setStorage({
					key: 'avatar',
					data: this.avatar,
				})
				let ress = res
				uni.login({
					provider: "weixin",
					success:function(loginRes) {
						console.log(loginRes)
						uni.request({ // 获取后台给用户安排的个人信息
							url: 'https://www.xiaonengxinxi.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=account.programslogin&app=1',
							method: 'POST',
							data: {
								code: loginRes.code,
								encryptedData: ress.detail.encryptedData,
								iv: ress.detail.iv,
								rawData: ress.detail.rawData,
								signature: ress.detail.signature,
								pid: o.pid,
								pids: o.pids
							},
							header:{
								'Content-Type':'application/x-www-form-urlencoded;charset=UTF-8',
							},
							success: (detail) => { // 后台存取数据
							console.log(detail)
								o.session_key = detail.data.session_key
								o.openid = detail.data.openid
								
								uni.request({
									url: 'https://www.xiaonengxinxi.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=account.small_app_login&app=1',
									method: 'POST',
									data: {
										openid: o.openid,
										mobile: 0, // 传给后台手机号
										nickname: o.nickname,
										avatar: o.avatar,
										province: o.province,
										city: o.city,
										pid: o.pid,
										pids: o.pids
									},
									header:{'Content-Type':'application/x-www-form-urlencoded'},
									success: res => {
										uni.setStorage({
											key: 'openid',
											data: res.data.openid,
											success: function () {
												setTimeout(function() {
													uni.navigateBack()
												}, 1700);
											}
										})
									},
									fail: () => {},
									complete: () => {}
								});
								
								// if (!o.can_login) {
								// 	o.btnClick() // 唤起授权获去手机号弹窗
								// 	return
								// }
							}
						});
					}
				})
			},
			btnClick() {
				this.show = true;
			},
			close() {
				// console.log('close');
			},
			open() {
				// console.log('open');
			},
			navTo(url){
				uni.reLaunch({
					url
				}) 
			},
			jump(e){
				uni.navigateTo({
					url: e.currentTarget.dataset.src
				});
			},
			mobileInput(e){
				this.mobile = e.target.value
			},
			pwdInput(e){
				this.pwd = e.target.value
			},
			back(){
				uni.reLaunch({
					url: '../home/home'
				});
			},
			weixin_load() {
				uni.showToast({
					title: '即将开放',
					icon:"none"
				});
				return
				var _self;
				// #ifdef APP-PLUS
				uni.login({
					success: (res) => {
						 uni.getUserInfo({
							success: (info) => {
								// 与服务器交互将数据提交到服务端数据库
								uni.request({
									url: 'https://www.xiaonengxinxi.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=account.applogin&app=1',
									method: 'POST',
									header: {'content-type' : "application/x-www-form-urlencoded"},
									data: {
										 openid: info.userInfo.openId,
										 nickname: info.userInfo.nickName,
										 avatar: info.userInfo.avatarUrl,
										 province: info.userInfo.province,
										 city: info.userInfo.city,
									},
									success: res => {
										if(res.statusCode == 200){
											uni.setStorage({
												key: 'openid',
												data: res.data.openid,
												success: (res) => {},
												fail: () => {}
											})
											uni.setStorage({
												key: 'mid',
												data: res.data.mid,
												success: (res) => {},
												fail: () => {}
											})
											setTimeout(()=>{
												this.loading = false
												uni.reLaunch({
													url: '../member/member'
												});
											},500)
											uni.showToast({
												title: '登陆成功',
												mask: false,
												duration: 1500
											});
										}else{
											uni.showToast({title:'微信登陆失败'});
										}
									},
									fail: () => {
										console.log('登陆失败')
									},
									complete: () => {}
								});
							},
							fail: () => {
								uni.showToast({title:"微信登录授权失败"});
							}
						})
					},
					fail: () => {
						uni.showToast({title:"微信登录授权失败"});
					}
				})
			// #endif
			},
			login(){
				this.loading = true
				if(this.mobile == ""){
					this.loading=false
					uni.showToast({
						title: '请输入手机号',
						icon:"none"
					});
				}else if(this.pwd == ""){
					this.loading = false
					uni.showToast({
						title: '请输入密码',
						icon:"none"
					});
				}else{
					var data = {
							'openid': this.mobile,
							'pwd': this.pwd,
						}
						// console.log(JSON.stringify(data))
					uni.request({
						url: 'https://www.xiaonengxinxi.com/app/index.php?i=4&c=entry&m=ewei_shopv2&do=mobile&r=account.login&app=1',
						method: 'POST',
						data: data,
						header:{'Content-Type':'application/x-www-form-urlencoded'},
						success: res => {
							// console.log(JSON.stringify(res));return false;
							if(res.data.status == 0){
								uni.showToast({
									title: res.data.result.message,
									icon:"none"
								});
								this.loading = false
							}else{
								uni.setStorage({
									key: 'openid',
									data: res.data.result.openid,
									success: (res) => {},
									fail: () => {}
								})
								uni.setStorage({
									key: 'mid',
									data: res.data.result.mid,
									success: (res) => {},
									fail: () => {}
								})
								setTimeout(()=>{
									this.loading = false
									uni.reLaunch({
										url: '../member/member'
									});
								},500)
							}
						},
						fail: () => {},
						complete: () => {}
					});
				}
			}
		}
	}
</script>

<style>
	page {background-color:#fff;}
	image {width:240upx;height:240upx;}
	button {margin:60upx 30upx 20upx;}
	.logo {display:block;margin:0 auto 60upx;}
	.content {position:fixed;width:750upx;top:50%;margin-top:-550upx;}
	.input {border-bottom:1px solid #f0f0f0;margin:0 30upx;}
	.input image {width:50upx;height:50upx;margin-left:20upx;margin-right:10upx;margin-top:15upx;}
	.input input {line-height:80upx;font-size:28upx;height:80upx;}
	.btn-group{margin:0 30upx;}
	.btn-group view {color:#999;}
</style>
